<template>
  <div>
    <h2>登陆页面</h2>
    <table  class="table table-bordered">
      <tr>
        <td align="right">账号</td>
        <td>
          <input type="text" v-model="info.UserName"/>
        </td>
      </tr>
      <tr>
        <td align="right">密码</td>
        <td>
          <input type="password" v-model="info.UserPwd">
        </td>
      </tr>
      <tr>
        <td align="right"></td>
        <td>
          <input type="button" value="登陆" class="btn btn-success" @click="login">
        </td>
      </tr>
    </table>
  </div>
</template>

<script setup lang="ts">
import {ref,reactive,onMounted} from 'vue';
import axios from "axios";
import {useRouter} from 'vue-router';
//useRouter:作用创建出一个路由器 实现页面跳转 并且 可以惊醒传参
const router = useRouter();

let info:any = reactive({
  UserName: '',
  UserPwd: ''
});

const login = () => {
  //1.有效验证
  if(info.UserName == ""){
    alert('账号不能为空');
    return;
  }
  if(info.UserPwd == ""){
    alert('密码不能为空');
    return;
  }
  //2.发送网络请求
  axios({
    url:'/api/Admins/AddAdmin',//向后端请求的地址
    method:'get',//请求方式
    params:info,
  })
      .then((res) => {
        //then请示成功要调的函数 res请求结果
        console.log(res);
        if(res.data==-1){
          alert('账号不存在');
          return;
        }
        else if(res.data==-2){
          alert('密码错误');
        }
        else{
          alert('登陆成功');
          router.push('/UserAddView');
        }
      })
      .catch((err) => {

      })
}
</script>

<style scoped>

</style>